<template>
    <el-row :gutter="20">
        <!--<el-col :span="4"><div class="grid-content bg-purple">Redefine</div></el-col>-->
        <el-col :span="16">
            <el-menu :default-active="pageDefault" class="el-menu-demo" mode="horizontal" @select="handleSelect">
                <el-menu-item v-for="item in menuList" :index="item.menuNode" :key="item.menuCode">{{item.menuName}}</el-menu-item>
                <!--<template  v-for="item in menuList">-->
                    <!--<el-submenu v-if="(item && item.subMenuList) !== null" :index="item.menuNode">-->
                        <!--<template slot="title">{{item.menuName}}</template>-->
                        <!--<el-menu-item  v-for="subItem in (item && item.subMenuList)" :index="subItem.menuNode">{{subItem.menuName}}</el-menu-item>-->
                    <!--</el-submenu>-->
                    <!--<el-menu-item v-if="(item && item.subMenuList) === null" :index="item.menuNode">{{item.menuName}}</el-menu-item>-->
                <!--</template >-->
            </el-menu>
        </el-col>
        <el-col :span="8">
            <elheaderinfo></elheaderinfo>
        </el-col>
    </el-row>
</template>

<script>

    import elheaderinfo from "./el-header-info";

    export default {
        components: {elheaderinfo},
        name: "el-header",
        props: {
            menuList: Array,
            required: true
        },
        data() {
            return {
                pageDefault : "",
            }
        },
        watch: {
            $route() {
                // debugger
                if (this.$route.meta.parentPath) {
                    // 实现路由切换
                    this.pageDefault = this.$route.meta.parentPath;
                }
            }
        },
        methods: {
            handleSelect(key, keyPath) {
                for(let i = 0; i < this.menuList.length; i++) {
                    if(this.menuList[i].menuNode == keyPath[0]) {
                        this.$emit('getMenuIndex', i);
                        // this.$router.push({ path: '/home/' + key });
                        break;
                    }
                }
                // console.log(key, keyPath);
            }
        }
    }
</script>

<style>

</style>
